<!doctype html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="chrome=1">
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
    <style type="text/css">
        html,
        body,
        .map {
            width: 100%;
            background: white !important;
            height: 100%;
            margin: 0px;
        }
    </style>
    <title>简易行政区地图标注</title>
</head>

<body>
    <div id="container" class="map" tabindex="0"></div>
    <script language="javascript"
        src="https://webapi.amap.com/maps?v=2.0&key=您申请的key值&plugin=AMap.Scale,AMap.ToolBar"></script>
    <script type="text/javascript" src="https://a.amap.com/jsapi_demos/static/demo-center/data/china-pp.js"></script>
    <script type="text/javascript">

        var SOC = 'CHN'
        var colors = {};
        var GDPSpeed = {
            '520000': 10,//贵州
            '540000': 10,//西藏
            '530000': 8.5,//云南 
            '500000': 8.5,//重庆
            '360000': 8.5,//江西
            '340000': 8.0,//安徽
            '510000': 7.5,//四川
            '350000': 8.5,//福建
            '430000': 8.0,//湖南
            '420000': 7.5, //湖北
            '410000': 7.5,//河南
            '330000': 7.0,//浙江
            '640000': 7.5,//宁夏
            '650000': 7.0,//新疆
            '440000': 7.0,//广东
            '370000': 7.0,//山东
            '450000': 7.3,//广西
            '630000': 7.0,//青海
            '320000': 7.0,//江苏
            '140000': 6.5,//山西
            '460000': 7,// 海南
            '310000': 6.5,//上海
            '110000': 6.5, // 北京
            '130000': 6.5, // 河北
            '230000': 6, // 黑龙江
            '220000': 6,// 吉林
            '210000': 6.5, //辽宁
            '150000': 6.5,//内蒙古
            '120000': 5,// 天津
            '620000': 6,// 甘肃
            '610000': 8.5,// 甘肃
            '710000': 2.64, //台湾
            '810000': 3.0, //香港
            '820000': 4.7 //澳门

        }
        var getColorByDGP = function (adcode) {
            if (!colors[adcode]) {
                var gdp = GDPSpeed[adcode];
                if (!gdp) {
                    colors[adcode] = 'rgb(227,227,227)'
                } else {
                    var r = 3;
                    var g = 140;
                    var b = 230;
                    var a = gdp / 10;
                    colors[adcode] = 'rgba(' + r + ',' + g + ',' + b + ',' + a + ')';
                }
            }
            return colors[adcode]
        }

        var disCountry = new AMap.DistrictLayer.Country({
            zIndex: 10,
            SOC: 'CHN',
            depth: 1,
            styles: {
                'nation-stroke': '#ff0000',
                'coastline-stroke': '#0088ff',
                'province-stroke': 'grey',
                'fill': function (props) {
                    return getColorByDGP(props.adcode_pro)
                }
            }
        })

        var map = new AMap.Map("container", {
            zooms: [4, 10],
            center: [106.122082, 33.719192],
            zoom: 4,
            isHotspot: false,
            defaultCursor: 'pointer',
            layers: [
                disCountry
            ],
            viewMode: '3D',
        })
        map.addControl(new AMap.Scale());
        map.addControl(new AMap.ToolBar({ liteStyle: true }));
        map.on('complete', function () {
            var layer = new AMap.LabelsLayer({
                // 开启标注避让，默认为开启，v1.4.15 新增属性
                collision: false,
                // 开启标注淡入动画，默认为开启，v1.4.15 新增属性
                animation: true,
            });
            for (var i = 0; i < LabelsData.length; i++) {
                var labelsMarker = new AMap.LabelMarker(LabelsData[i]);
                layer.add(labelsMarker);
            }
            map.add(layer);
        })

        document.getElementsByClassName('amap-mcode')[0].innerHTML = '-GS(2019)756号'
    </script>
</body>

</html>